<template>
 <v-card>
    <Branch-query-condition :startDate = "startDate" :endDate = "endDate" :search = "search"></Branch-query-condition>
    <v-card-text class="pa-0 backdrop" >
      <!-- <Branch-list :tableData = "users"></Branch-list> -->
      <Timer-shaft :items = "items" ></Timer-shaft>
    </v-card-text>
 </v-card>
</template>

<script>
import BranchList from "@/components/BranchList"
import BranchQueryCondition from "./BranchQueryCondition.vue"
import TimerShaft from "./TimerShaft.vue"
import { Items as Users } from "@/api/user";
export default {
   data () {
     return {
        users:Users,
        startDate: null,
        endDate: null,
        search: "",
        height:"500px",
        items: [
       {
          color: 'red lighten-2',
          icon: 'mdi-star'
        },
        {
          color: 'purple darken-1',
          icon: 'mdi-book-variant'
        },
        {
          color: 'green lighten-1',
          icon: 'mdi-airballoon'
        },
        {
          color: 'indigo',
          icon: 'mdi-buffer'
        },
        {
          color: 'indigo',
          icon: 'mdi-buffer'
        },
        {
          color: 'indigo',
          icon: 'mdi-buffer'
        },
        {
          color: 'indigo',
          icon: 'mdi-buffer'
        },
        {
          color: 'indigo',
          icon: 'mdi-buffer'
        },
        {
          color: 'indigo',
          icon: 'mdi-buffer'
        },
        {
          color: 'indigo',
          icon: 'mdi-buffer'
        },
        {
          color: 'indigo',
          icon: 'mdi-buffer'
        }
      ]
     }
   },
   components: {
        BranchList,
        BranchQueryCondition,
        TimerShaft
   },
   mounted () {
      //监控浏览器大小
      this.onResize();
      window.addEventListener("resize", this.onResize, { passive: true });
   },
   methods: {
      onResize() {
       console.log(this.$vuetify.breakpoint.height)
      }
   }
 }
</script>

<style scoped>
.backdrop {
  overflow:auto
}
 
</style>
